@extends('common.base-master')

@section('html-head')

@endsection

@section('html-body')
    <div class="qiandao-page">
        <div class="qiandao-header">
            <div class="mycoins">我的波罗币：@if($userinfo){{$userinfo->coin}}@endif</div>
            <div class="sign-box">
                <div class="sign-title">签到领积分</div>
                <div class="bg-sign_btn"></div>
                <div class="bg-sign_text @if(!$today_signed)hidden @endif"></div>
                <a href="{{route('Home.User.coinDetail')}}" class="coins-detail">积分明细</a>
                <div class="sign-rule">
                    <span class="bg-question_icon"></span>
                    签到规则
                    <div class="rule-box hidden" id="help-text">每日签到一次，可获得2个波罗币。</div>
                </div>
                <img class="bg" src="{{url('images/sign_bg.png')}}" alt="">
            </div>
        </div>
        <div class="calendar-header">

            <div class="calendar_month_span"></div>
            <div class="sign-days"></div>
        </div>
        <div style="" id="calendar"></div>
        <div class="share-links">
            <a href="{{route('Home.Goods.goodsList')}}" style="margin-right: 20px;">兑换商品</a>
            <a href="{{route('Home.User.myShare')}}">分享·邀请码</a>
            <div class="text">分享邀请码，成功邀请好友,可获得更多波罗币哦！</div>
        </div>
        <div class="sign-success hidden">
            <div class="bg-sign_success"></div>
        </div>
    </div>
    {{--<script src="js/jquery.min.js"></script>--}}
    <script>
        var calUtil = {
            //当前日历显示的年份
            showYear:2015,
            //当前日历显示的月份
            showMonth:1,
            //当前日历显示的天数
            showDays:1,
            eventName:"load",
            //初始化日历
            init:function(signList,s=''){
                calUtil.setMonthAndDay();
                if (typeof(s) == 'undefined'){
                }else{
                    signList.splice('','',s);
                }
                calUtil.draw(signList);
                calUtil.bindEnvent(signList);
            },
            draw:function(signList){
                //绑定日历
                //alert(signList.length);
                // console.log(signList);
                // if(signList.length > 21){
                //   //alert(21);
                //   $("#sign_note").empty();
                //   $("#sign_note").html('<button class="sign_contener" type="button"><i class="fa fa-calendar-check-o" aria-hidden="true"></i>&nbsp;已达标，获取1次抽奖</button>');
                // }
                var str = calUtil.drawCal(calUtil.showYear,calUtil.showMonth,signList);
                $("#calendar").html(str);
                //绑定日历表头
                var calendarName=calUtil.showYear+"年"+calUtil.showMonth+"月";
                $(".calendar_month_span").html(calendarName);
            },
            //绑定事件
            bindEnvent:function(signList){
                // //绑定上个月事件
                // $(".calendar_month_prev").click(function(){
                //   //ajax获取日历json数据
                //   //var signList=[{"signDay":"10"},{"signDay":"11"},{"signDay":"12"},{"signDay":"13"}];
                //   calUtil.eventName="prev";
                //   calUtil.init(signList);
                // });
                // //绑定下个月事件
                // $(".calendar_month_next").click(function(){
                //   //ajax获取日历json数据
                //   //var signList=[{"signDay":"10"},{"signDay":"11"},{"signDay":"12"},{"signDay":"13"}];
                //   calUtil.eventName="next";
                //   calUtil.init(signList);
                // });

                // $(".calendar_record").click(function(){
                //   //ajax获取日历json数据
                //   //alert(typeof(signList)+"yxy");
                // 	//var signList=[{"signDay":"10"},{"signDay":"11"},{"signDay":"12"},{"signDay":"13"}];
                // 	//var tmp = {"signDay":$(this).html()};
                //   //if (typeof(signList) == 'undefined'){
                //     //不做处理
                //   //}else{
                //   //  signList.splice('','',tmp);
                //   //  console.log(signList);
                //   //  calUtil.init(signList);
                //  // }
                //  //alert($(this).html());
                // var tmp = {"signDay":$(this).html()};
                // calUtil.init(signList,tmp);



                // });
            },
            //获取当前选择的年月
            setMonthAndDay:function(){
                switch(calUtil.eventName)
                {
                    case "load":
                        var current = new Date();
                        calUtil.showYear=current.getFullYear();
                        calUtil.showMonth=current.getMonth() + 1;
                        break;
                    case "prev":
                        var nowMonth=$(".calendar_month_span").html().split("年")[1].split("月")[0];
                        calUtil.showMonth=parseInt(nowMonth)-1;
                        if(calUtil.showMonth==0)
                        {
                            calUtil.showMonth=12;
                            calUtil.showYear-=1;
                        }
                        break;
                    case "next":
                        var nowMonth=$(".calendar_month_span").html().split("年")[1].split("月")[0];
                        calUtil.showMonth=parseInt(nowMonth)+1;
                        if(calUtil.showMonth==13)
                        {
                            calUtil.showMonth=1;
                            calUtil.showYear+=1;
                        }
                        break;
                }
            },
            getDaysInmonth : function(iMonth, iYear){
                var dPrevDate = new Date(iYear, iMonth, 0);
                return dPrevDate.getDate();
            },
            bulidCal : function(iYear, iMonth) {
                var aMonth = new Array();
                aMonth[0] = new Array(7);
                aMonth[1] = new Array(7);
                aMonth[2] = new Array(7);
                aMonth[3] = new Array(7);
                aMonth[4] = new Array(7);
                aMonth[5] = new Array(7);
                aMonth[6] = new Array(7);
                var dCalDate = new Date(iYear, iMonth - 1, 1);
                var iDayOfFirst = dCalDate.getDay();
                var iDaysInMonth = calUtil.getDaysInmonth(iMonth, iYear);
                var iVarDate = 1;
                var d, w;
                aMonth[0][0] = "日";
                aMonth[0][1] = "一";
                aMonth[0][2] = "二";
                aMonth[0][3] = "三";
                aMonth[0][4] = "四";
                aMonth[0][5] = "五";
                aMonth[0][6] = "六";
                for (d = iDayOfFirst; d < 7; d++) {
                    aMonth[1][d] = iVarDate;
                    iVarDate++;
                }
                for (w = 2; w < 7; w++) {
                    for (d = 0; d < 7; d++) {
                        if (iVarDate <= iDaysInMonth) {
                            aMonth[w][d] = iVarDate;
                            iVarDate++;
                        }
                    }
                }
                return aMonth;
            },
            ifHasSigned : function(signList,day){
                var signed = false;
                $.each(signList,function(index,item){
                    if(item.signDay == day) {
                        signed = true;
                        return false;
                    }
                });
                return signed ;
            },
            drawCal : function(iYear, iMonth ,signList) {
                var myMonth = calUtil.bulidCal(iYear, iMonth);
                var htmls = new Array();
                htmls.push("<div class='sign_main' id='sign_layer'>");
                // htmls.push("<div class='sign_succ_calendar_title'>");
                //htmls.push("<div class='calendar_month_next'>下月</div>");
                //htmls.push("<div class='calendar_month_prev'>上月</div>");
                // htmls.push("<div class='calendar_month_span'></div>");
                // htmls.push("</div>");
                htmls.push("<div class='sign_equal' id='sign_cal'>");
                htmls.push("<div class='sign_row'>");
                htmls.push("<div class='th_1 bold'>" + myMonth[0][0] + "</div>");
                htmls.push("<div class='th_2 bold'>" + myMonth[0][1] + "</div>");
                htmls.push("<div class='th_3 bold'>" + myMonth[0][2] + "</div>");
                htmls.push("<div class='th_4 bold'>" + myMonth[0][3] + "</div>");
                htmls.push("<div class='th_5 bold'>" + myMonth[0][4] + "</div>");
                htmls.push("<div class='th_6 bold'>" + myMonth[0][5] + "</div>");
                htmls.push("<div class='th_7 bold'>" + myMonth[0][6] + "</div>");
                htmls.push("</div>");
                var d, w;
                for (w = 1; w < 6; w++) {
                    htmls.push("<div class='sign_row'>");
                    for (d = 0; d < 7; d++) {

                        var ifHasSigned = calUtil.ifHasSigned(signList,myMonth[w][d]);

                        if(isNaN(myMonth[w][d])) {
                            htmls.push("<div class='td_"+d+" on'></div>");
                        }else {

                            if(ifHasSigned && typeof(myMonth[w][d]) != 'undefined'){
                                htmls.push("<div class='td_"+d+" on'><span>" + myMonth[w][d] + "</span></div>");
                            } else {
                                htmls.push("<div class='td_"+d+" calendar_record'><span>" + myMonth[w][d] + "</span></div>");
                            }
                        }
                    }
                    htmls.push("</div>");
                }
                htmls.push("</div>");
                htmls.push("</div>");
                htmls.push("</div>");
                return htmls.join('');
            }
        };
        $(document).ready(function () {
            //ajax获取日历json数据
            var signList= '';
            $.ajax({
                url:"{{route('Api.User.getMySigneds')}}",
                type:'get',
                dataType:'json',
                async: false,
                success:function (obj) {
                    if(obj.level == 'success'){
                        signList = obj.data;
                    }else {
                        $.toast(obj.message);
                    }
                },
                error:function (obj) {
                    console.log(obj);
                }
            });
            // 连续签到天数
            var signdays = '{{$sign_count}}';
            calUtil.init(signList);
            $('.sign-days').html('本月已签到<span>'+ signdays+ '</span>天');
            
            $('.bg-sign_btn').click(function () {
                $.ajax({
                    url:"{{route('Api.User.qianDao')}}",
                    type:'get',
                    dataType:'json',
                    success:function (obj) {
                        if(obj.level == 'success'){
                            $('.sign-success').removeClass('hidden');
                            setTimeout(function(){
                                window.location.reload();
                            }, 3000);
                        }else {
                            $.toast(obj.message,'forbidden');
                        }
                    },
                    error:function (obj) {
                        console.log(obj);
                    }
                });
            });

            var showHelp = false;
            $('.bg-question_icon').click(function () {
                if(!showHelp){
                    $('#help-text').removeClass('hidden');
                    showHelp = true;
                }else {
                    $('#help-text').addClass('hidden');
                    showHelp = false;
                }
            });
        })
    </script>
@endsection